<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>自定义菜单</title>
  <link href="css/bootstrap.min.css" rel="stylesheet">
  <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
  <script src="js/bootstrap.min.js"></script>
  <script src="js/pagination.js"></script>

  <style type="text/css">
	.pageTop {
		width: 100%;
		height: 45px;
		line-height: 45px;
		background-color: #f2f2f2;
	}

	.page {
		width: 96%;
		margin: 30px auto;
	}

	.page table tr td {
		text-align: center;
		border: 1px solid #dcdbdb;
		height: 40px;
	}

	.page table tr th {
		text-align: center;
		border: 1px solid #dcdbdb;
		background-color: #f2f2f2;
		color: #438eb9;
		height: 40px;
	}

	.distence {
		margin-bottom: 20px;
	}
	
  </style>
  <script type="text/javascript">
	  /** 获取一级菜单 **/
	  $(function() {
		$.ajax( {    
			url:"http://localhost/wxcms/web/wlmenu.php",
			data:{
				operation:"getFirstMenu",
			},    
			type:'POST',    
			cache:false,    
			dataType:'json',
			success : function(data) {
				//alert(JSON.stringify(data));
				//遍历json数组
				$.each(data, function(n, obj) {
					$("#firstMenu").append("<option value='"+obj.id+"'>"+obj.menu_name+"</option>");
				});
			},    
			error : function() {
				alert("操作失败，请重试或联系管理员");    
			}    
		});
	  });

      /** 动作类型 **/
	  function changeAction() {
		  var actionType = $("#actionType").find("option:selected").val();
		  alert(actionType);
		  if(Number(actionType) == 1) {//点击推事件
			$("#relateKeywords").css("display", "block");
			$("#relateURL").css("display", "none");
		  } else if(Number(actionType) == 2) {//关联关键词
			$("#relateKeywords").css("display", "none");
			$("#relateURL").css("display", "block");
		  }
	  }
	
	  /** 编辑菜单 **/
	  function operationMenu(id, op) {
		 //ajax获取菜单的数据
		 $.ajax( {    
			url:"web/wlmenu.php",
			data:{
				id:id,
				operation:op,
			},    
			type:'POST',    
			cache:false,    
			dataType:'json',
			success : function(data) {
				//alert(JSON.stringify(data));
				if(op == "edit") {
					$("#menuId").val(data.id);
					$("#firstMenu").find("option[value='"+data.parent_menu_id+"']").attr("selected", true);
					$("#menuName").val(data.menu_name);
					$("#actionType").find("option[value='"+data.action_type+"']").attr("selected", true);
					$("#actionValue").val(data.action_value);
					$("#rank").val(data.rank);
				} else if(op == "del") {
					alert(data.msg);
					window.location.reload();
				}
			},    
			error : function() {
				alert("操作失败，请重试或联系管理员");    
			}    
		});
		$('#myModal').modal('show');
	  }
	  
	  /** 表单提交 **/
	  function submit() {
		var params = JSON.stringify($('#addMenu').serializeArray());
		$.ajax( {    
			url:"web/wlmenu.php",
			data:{
				operation:"add",
				params:params,
			},
			type:'POST',    
			cache:false,    
			dataType:'text',
			success : function(data) {
				alert(data);
				window.location.reload();
			},    
			error : function() {
				alert("操作失败，请重试或联系管理员");    
			}    
		});
	  }
  </script>
 </head>
 <body>
   <div>
		<div class="pageTop">
			<span style="color: #3695cc; padding-left: 30px; cursor: pointer;">自定义菜单</span>
		</div>
		<!-- 添加自定义菜单开始 -->
		<div style="margin: 30px 26px;">
			<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">添加自定义菜单</button>
			<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			   <div class="modal-dialog">
				  <div class="modal-content">
					 <div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
						<h4 class="modal-title" id="myModalLabel">添加菜单</h4>
					 </div>
					 <div class="modal-body" style="margin: auto 100px;">
						<form id="addMenu" action="web/wlmenu.php" method="POST">
							<!-- 隐藏域 -->
							<input type="hidden" id="menuId" name="menuId" value="" />
							<div class="distence">
								<div>
									<label>一级菜单</label>
									<span>(如果是一级菜单，选择“无”即可)</span>
								</div>
								<div>
									<select id="firstMenu" name="firstMenu" style="width: 120px; height: 30px;">
										<option value="0">无</option>
									</select>
								</div>
							</div>
							<div class="distence">
								<div>
									<label>菜单名</label>
									<span>(可创建最多3个一级菜单，每个一级菜单下可创建最多5个二级菜单)</span>
								</div>
								<div>
									<input id="menuName" name="menuName" value="" style="height: 33px;"/>
								</div>
							</div>
							<div class="distence">
								<div>
									<label>动作类型</label>
								</div>
								<div>
									<select id="actionType" name="actionType" style="width: 120px; height: 30px;" onchange="changeAction();";>
										<option value="1">点击推事件</option>
										<option value="2">跳转URL</option>
									</select>
								</div>
							</div>
							<div class="distence">
								<div>
									<label id="relateKeywords">关联关键词</label>
									<label id="relateURL" style="display: none;">关联URL</label>
								</div>
								<div>
									<input id="actionValue" name="actionValue" value="" style="height: 33px; width: 300px;"/>
								</div>
							</div>
							<div class="distence">
								<div>
									<label>排序号</label>
								</div>
								<div>
									<input id="rank" name="rank" value="0" style="height: 33px;"/>
								</div>
							</div>
						</form>
					 </div>
					 <div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
						<button type="button" class="btn btn-primary" onclick="submit();">保存</button>
					 </div>
				  </div><!-- /.modal-content -->
			   </div><!-- /.modal-dialog -->
			</div><!-- /.modal -->
			<script>
			   $(function () { 
					$('#myModal').modal('hide');
			   });
			</script>
			<script>
				//当调用 hide 实例方法时触发
			   /*$(function () { $('#myModal').on('hide.bs.modal', function () {
				  alert('嘿，我听说您喜欢模态框...');})
			   });*/
			</script>
		</div>
		<!-- 添加自定义菜单结束 -->
		<div class="page">
			<table align="center" border="1" cellspacing="0" cellpadding="0" style="width: 100%; border: 1px solid #dcdbdb;">
				<thead>
				  <tr>
					 <th style="width: 5%;"><input type="checkbox" onclick="selectAll()" name="controlAll" id="controlAll" /></th>
					 <th style="width: 8%;">一级菜单</th>
					 <th style="width: 10%;">菜单名</th>
					 <th style="width: 10%;">动作类型</th>
					 <th style="width: 20%;">动作值</th>
					 <th style="width: 8%;">排序号</th>
					 <th style="width: 15%;">操作</th>
				  </tr>
			   </thead>
			   <tbody>
				  <?php
						require("APP_ROOT.php");
						require(__ROOT__."/class/mysqlpdo.class.php");
						require_once(__ROOT__."/page.php");
						//获取请求参数 页数
						$page = 1;
						$nickName = "";
						$param = array();
						if(!empty($_GET["page"])) {
							$page = $_GET["page"];
						}
						if(!empty($_GET["nickName"])) {
							$nickName = $_GET["nickName"];
							$param["nick_name"] = $nickName;
						}
						//var_dump($page);
						//查询数据
						$pdo = new mysqlpdo();
						$totalCount = $pdo -> fetch("t_custom_menu", "COUNT(1)", $param);
						//总记录数
						$totalRecord = intval($totalCount["COUNT(1)"]);
						//计算总页数
						$totalPages = getTotalPages($totalRecord);
						$SQL = "SELECT *,
								IF(T1.parent_menu_id > 0, (SELECT menu_name FROM t_custom_menu WHERE id = T1.parent_menu_id), '无') first_menu
								FROM t_custom_menu T1";
						$result = $pdo -> query($SQL, $page);
						if(!empty($result) && count($result) > 0) {
							foreach($result as $obj) {
					?>
								<tr>
								 <td><input type="checkbox" name="id" id="id" value="<?php echo $obj["id"] ?>"/></td>
								 <td><?php echo $obj["first_menu"] ?></td>
								 <td><?php echo $obj["menu_name"] ?></td>
								 <td><?php if(intval($obj["action_type"]) == 1) {echo "点击推事件";} else if(intval($obj["action_type"]) == 2) {echo "跳转URL";} else {echo "未知";} ?></td>
								 <td><?php echo $obj["action_value"] ?></td>
								 <td><?php echo $obj["rank"] ?></td>
								 <td>
									<div style="color: #4baaee; cursor: pointer;">
										<span onclick="operationMenu(<?php echo $obj["id"] ?>, 'edit');">编辑</span>
										<span onclick="operationMenu(<?php echo $obj["id"] ?>, 'del');"> | 删除</span>
									</div>
								 </td>
							  </tr>
					<?php	
							}
						}
					if($totalPages > 1) {
						//分页
						echo "<script type='text/javascript'>$(function() { pagination($page, $totalPages, 'custom_menu.php'); });</script>";
					}
				   ?>
			   </tbody>
			</table>
		<div>
		<?php include("common/pagination.html") ?>
   </div>
 </body>
</html>
